<extend  name="Public:iframe" />

<block name="content">
    <form class="layui-form" style="">
        <div class="layui-form-item">
            <label class="layui-form-label">标题</label>
            <div class="layui-input-block">
                <input type="text" name="title" value="" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">所属类型</label>
            <div class="layui-input-block">
                <select name="type" lay-verify="required">
                    <option value=""></option>
                    <volist name="types" id="tt">
                        <option value="{$tt.id}">{$tt.name}</option>
                    </volist>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">缩略图</label>
            <button type="button" class="layui-btn" id="uploadImg">
                <i class="layui-icon">&#xe67c;</i>上传图片
            </button>
            <div class="layui-upload-list">
                <img class="layui-upload-img" id="img">
                <input type="hidden" name="picture" id="url">
                <!--<p id="demoText"></p>-->
            </div>
        </div>
        <div class="layui-inline">
            <div class="layui-form-item">
                <label class="layui-form-label">发布时间</label>
                <div class="layui-input-block">
                    <input id="selectDate" class="layui-input search-input date-icon" type="text" name="add_time" placeholder="请选择日期" style="width: 175px;" />
                </div>
            </div>

        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">内容</label>
            <div class="layui-input-block">
                <textarea id="content" style="display: none;"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="radio" name="status" value="0" title="禁用">
                <input type="radio" name="status" value="1" title="启用" checked>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="button" class="layui-btn" lay-submit lay-filter="submit">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
        <!-- 更多表单结构排版请移步文档左侧【页面元素-表单】一项阅览 -->
    </form>
</block>
<block name="foot_script">
    <script>
        $(layui.use(['layer','form','layedit'], function(){
            var layer   = layui.layer,
                laydate = layui.laydate,
                form    = layui.form,
                layedit = layui.layedit,
                upload  = layui.upload;

            // 选择日期
            laydate.render({
                elem: '#selectDate'
                ,type: 'datetime'
            });
            layedit.set({
                uploadImage: {
                    url: '{:U("Article/uploadImg")}' //接口url
                }
            });
            var index = layedit.build('content'); //建立编辑器

            form.on('submit(submit)',function (data) {
                data.field.content = layedit.getContent(index);
                $.post('{:U("Article/add")}',data.field,function (res) {
                    if (res.code === 1){
                        layer.msg(res.msg,{time:1000},function () {
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                            parent.layui.table.reload('dataTable');
                        });
                    } else {
                        layer.msg(res.msg,{time:1000});
                    }
                });
                return false;
            });

            var uploadInst = upload.render({
                elem: '#uploadImg' //绑定元素
                ,url: '{:U("Article/uploadImg")}' //上传接口
                ,done: function(res){
                    //上传完毕回调
                    if (res.code === 0){
                        $("#img").attr('src',res.data.src);
                        $("#url").val(res.data.src);
                    }
                }
                ,error: function(){
                    //请求异常回调
                    layer.msg('上传接口异常');
                }
            });

        }));
    </script>
</block>